import React, { Component } from 'react'

export default class index extends Component {
  state={
    hasError:""
  }
  static getDerivedStateFromError(error){
    // 更新 state 使下一次渲染能够显示降级后的 UI
    return {hasError:true};
  }
  componentDidCatch(error,errorInfoStack){
     // 你同样可以将错误日志上报给服务器
    console.log('此处统计错误，反馈给服务器，用于通知编码人员进行bug的解决')
  }
  render() {
    return (
      <div>
        <h1>我是parent组件</h1>
        {
          this.state.hasError?<h1>网络繁忙，请稍后再试</h1>
          :<A />
        }
      </div>
    )
  }
}
class A extends Component {
  state = {
    // students: [
    //   { id: 0, name: "xixi" },
    //   { id: 1, name: "haha" },
    //   { id: 2, name: "小李" }
    // ]
    students:"abc"
  }
  render() {
    return (
      <div>
        <h1>我是子组件</h1>
        {
          this.state.students.map((e, index) => {
            return <div key={e.id}>{e.name + '--' + index}</div>
          })
        }
      </div>
    )
  }
}

